$(function(){
    $(".scrollable").scrollable({circular: true,
                                  mousewheel: false})
        .autoscroll({interval: 3000});

    $('.nav li').click(function(){
        var _this = $(this);
        if(_this.hasClass('on')){
            return;
        }
        var selectedContent = $('.nav-content li').not('.on');

        _this.siblings('li').removeClass('on');
        _this.addClass('on');
        $('.nav-content li.on').removeClass('on');
        selectedContent.addClass('on');
    });

    var overlay = $('#overlay-mask'),
        rule = $('#rule'),
        sign = $('#sign'),
        process = $('#process');
    $('#rule-btn').click(function(){
        overlay.show();
        rule.show();
    });
    rule.find('a').click(function(){
        overlay.hide();
        rule.hide();
    });
    $('#sign-btn').click(function(){
        var _this = $(this);
        if(!bt.context('UserIsAuthenticated')){
            bt.misc.redirect_to_login();
            return;
        }
        if(_this.html() == '立即写游记'){
            bt.misc.showPopup($("#new-trip-popup"));
        }else{
            $.ajax({
                type : 'POST',
                url: '/mobile/baidu_fanyi/?op=signup',
                data: {
                    csrfmiddlewaretoken : bt.context('csrf_token')
                },
                success: function(resp) {
                    _this.html('立即写游记');
                    overlay.show();
                    sign.show();
                    sign.css('top',document.documentElement.clientHeight/2 - 313);
                    process.attr('src',process.data('src'));
                },
                error: function(resp) {
                    alert('网络错误，请稍后重试');
                }
            });
        }
        
        
    });
    $('#sign-close').click(function(){
        overlay.hide();
        sign.hide();
    });
    overlay.click(function(){
        overlay.hide();
        rule.hide();
        sign.hide();
    });

    var loadUrl = '/mobile/baidu_fanyi/?page=1',
        more = $('#load-more'),
        trips = $('.trips'),
        loadContent = [];
    var getMoreTrips = function () {
        $.get(loadUrl, function(data) {
            if ( data.success ) {
                loadContent = [];
                $.each(data.trips, function(i, val) {
                    var trip = [
                        '<li class="item pr fl">',
                            '<div class="cover pr">',
                                '<a href="/trips/'+val.id+'/">',
                                    '<img src="'+ (val.cover_image || '/static/img/default_trip_cover_205px.png') +'" />',
                                '</a>',
                            '</div>',
                            '<div class="info">',
                                '<div class="left fl">',
                                    '<h2 class="name">',
                                        '<a href="/trips/'+val.id+'/">',
                                            '<span>'+val.name+'</span>',
                                        '</a>',
                                    '</h2>',
                                    '<div class="date">',
                                        '<span class="trip-startdate">'+val.first_day+'</span>',
                                        '<span>&nbsp;|&nbsp;</span>',
                                        '<span class="trip-duration">'+val.day_count+'天</span>',
                                    '</div>',
                                '</div>',
                                '<div class="right fr">',
                                    '<div class="'+(val.recommended?'liked':'like')+'">',
                                        '<div class="icon fl"></div>',
                                        '<span class="fl">'+val.recommendations+'</span>',
                                    '</div>',
                                    '<div class="comments">',
                                        '<div class="icon fl"></div>',
                                        '<span class="fl">'+val.comment_count+'</span>',
                                    '</div>',
                                '</div>',
                            '</div>',
                        '</li>'
                    ];
                    loadContent.push(trip.join(''));
                });
                $(loadContent.join('')).appendTo(trips);
                $('.cover img').each(function(){
                    bt.misc.centerAlignImg($(this), 156, 278);
                });

                $('.cover img').bind('load', function(){
                    bt.misc.centerAlignImg($(this), 156, 278);
                });
                if ( data.more ) {
                    loadUrl = data.next_url;
                    more.show();
                }else{
                    loadUrl = '';
                    more.hide();
                }
            }
        }, 'json');
    };
    more.click(function(){
        getMoreTrips();
    });
    getMoreTrips();
});